<template>
  <view v-show="!isLoading" class="container">
    <!-- 商品图片轮播 -->
    <SlideImage
        v-if="!isLoading"
        :video="goods.video"
        :videoCover="goods.videoCover"
        :images="goods.goods_images"
    />

    <!-- 商品信息 -->
    <view v-if="!isLoading" class="goods-info m-top20">
		
		<!-- item.dataSource==1? item.image:httpUrlFn(item.image) -->
      <!-- 价格、销量 -->
      <view class="info-item info-item__top dis-flex flex-x-between flex-y-end">
        <view class="block-left dis-flex flex-y-center">
          <!-- 商品售价 -->
          <text class="floor-price__samll" >￥</text>
          <text class="floor-price" >{{ orderList.salePrice }}</text>
		 <text class="floor-price-dw">/份</text>
		 <image class="floor-price-image" src="/static/images/icon-ds.png" ></image>
          <!-- 会员价标签 -->
          <!--          <view v-if="goods.is_user_grade" class="user-grade">-->
          <!--            <text>会员价</text>-->
          <!--          </view>-->
          <!-- 划线价 -->
          <text class="original-price"
          >￥{{ orderList.originalPrice }}
          </text>
        </view>
        <view class="block-right dis-flex">
          <!-- 组件 -->
          <view class="goods-sales">
            <!-- <text>已售{{ orderList.sales }}</text> -->
			<u-icon name="share-square" color="#959595" size="28"></u-icon>
          </view>
		  <view class="goods-sales" @click="operateGoodsCollectfun">
		    <!-- <text>已售{{ orderList.sales }}</text> -->
			<u-icon name="heart" :color="operate==1?'#ff0000':'#959595'" size="28"></u-icon>
		  </view>
        </view>
      </view>
      <!-- 标题、分享 -->
      <view class="info-item info-item__name dis-flex flex-y-center">
        <view class="goods-name flex-box">
          <!-- <view class="twoline-hide">{{ orderList.prodName }}---</view> -->
          <view class="commission_money" v-if="orderList.commissionMoney>0">佣金:￥{{ orderList.commissionMoney }}
          </view>
        </view>
        <!-- #ifdef MP-WEIXIN -->
        <view class="goods-share__line"></view>
        <view class="goods-share">
          <button class="share-btn dis-flex flex-dir-column" open-type="share">
            <text class="share__icon iconfont icon-fenxiang"></text>
            <text class="f-24">分享</text>
          </button>
        </view>
        <!-- #endif -->
      </view>
      <!-- 商品卖点 -->
      <!--            <view-->
      <!--              v-if="detailObj.commission"-->
      <!--              class="info-item info-item_selling-point"-->
      <!--            >-->
      <!--              <text>{{ detailObj.commission }}</text>-->
      <!--            </view>-->
    </view>

    <!-- 选择商品规格 -->
    <!--    <view class="goods-choice m-top20 b-f" @click="onShowSkuPopup(3)">-->
    <!--      <view class="spec-list">-->
    <!--        <view class="flex-box">-->
    <!--          <text class="col-8">规格：</text>-->
    <!--          <text-->
    <!--            class="spec-name"-->
    <!--            v-for="(item, index) in shopPingSelSkusList"-->
    <!--            :key="index"-->
    <!--            >{{ item.prodName }}</text-->
    <!--          >-->
    <!--        </view>-->
    <!--        <view class="f-26 col-9 t-r">-->
    <!--          <text class="iconfont icon-arrow-right"></text>-->
    <!--        </view>-->
    <!--      </view>-->
    <!--    </view>-->
	<view class="goods-det">
		<view class="goods-det-cx">
			<view class="goods-det-cx-item">
				<view class="goods-det-cx-item-title">
					促销
				</view>
				<view class="goods-det-cx-item-content">
					满1件7.5折
				</view>
			</view>
			<view class="goods-det-cx-item">
				<view class="goods-det-cx-item-title">
					促销
				</view>
				<view class="goods-det-cx-item-content">
					满1件8折
				</view>
			</view>
		</view>
		<view class="goods-dt">
		  <view class="goods-right">{{orderList.name}}</view>
		 
		</view>
		
		
	</view>

    <!-- 已选规格 -->
    <view class="sku">
            <view >
             <view class="sku-tit">优惠</view>
			 <view class="sku-cx">促销</view>
             <view class="sku-con">满1件7.5折、满1件8折、满2件7.5 ...</view>
      <!--        <view class="more"> > </view>-->
	  
	  
           </view>
	 
      <view @tap="showSku">
        <view class="sku-tit">规格</view>
        <view class="sku-con">
          <!--                <text v-for="item in list">{{ item.value }}</text>-->
          <text >{{ goodsSpec[selectgoodsspec]?goodsSpec[selectgoodsspec].name:'' }}&nbsp;&nbsp; x{{prodNum}}</text>
          <!--          <text v-if="orderList.stocks !== 0">{{ orderList.selected }}</text>-->
          <!-- <text v-if="orderList.stocks === 0" style="color: red;">{{ "(" + orderList.inventory + ")" }}</text> -->
        </view>
        <view class="more"> <image src="/static/orderDetails/1.png" mode="widthFix"></image> </view>
      </view>
      <view>
        <view class="sku-tit">运费</view>
        <view class="sku-con">待下单时候确认</view>
        <view class="more"> <image src="/static/orderDetails/1.png" mode="widthFix"></image></view>
      </view>
	  
	  <view class="sku-bq">
	    <view class="sku-bq-item"><image src="/static/images/icon-dg.png" mode="widthFix">快递发货</view>
		<view class="sku-bq-item"><image src="/static/images/icon-dg.png" mode="widthFix">七天无理由退货</view>
	   
	  </view>
    </view>

    <!--   参数弹出层 -->
    <!--  <u-popup v-model="parameterToggle" mode="bottom" border-radius="5" @open="openFn" @close="closeFn" :closeable="true">-->
    <!--			<view class="parameter_wrapper" style="padding: 30rpx;">-->
    <!--          <p v-for="item in arr" style="padding: 12rpx;margin-bottom: 8rpx">{{item}}</p>-->
    <!--      </view>-->
    <!--  </u-popup>-->

    <u-popup
        :show="skuShow"
        mode="bottom"
        :round="20"
        @open="openFn"
        @close="closeFn"
		:overlayOpacity="0.5"
		:closeOnClickOverlay="true"
    >
      <view class="skuShow_wrapper">
        <view class="header_">
          <image :src=" orderList.dataSource==1?orderList.image: httpUrlFun(orderList.image)"/>
          <view class="money_wrapper">
			  <view class="item_3">
			    <view>
			      <!-- <text>已选：</text> -->
			      <text >{{orderList.name}}</text>
			      <!--                <text v-if="orderList.stocks !== 0">{{ orderList.selected }}</text>-->
			      <!-- <text v-if="orderList.stocks === 0" style="color: red;">{{ "(" + orderList.inventory + ")" }}</text> -->
			    </view>
			  </view>
            <view class="item_1">
              <view class="left_" v-if="login">￥
                <text>{{ goodsSpec[selectgoodsspec]?goodsSpec[selectgoodsspec].salePrice:"" || 0.00 }}</text>
				<!-- <text class="back_s" v-if="login">(含税价)</text> -->
              </view>
			  <!-- <view class="left_" v-if="!login" @tap.stop="gologin">
			    <text>点击咨询</text>
			  </view> -->
			  
             <!-- <view class="right_" v-if="orderList.oriPrice">￥
                <text>{{ orderList.oriPrice }}</text>
              </view> -->
            </view>
            <view class="item_2"> 剩余
              <text>{{ goodsSpec[selectgoodsspec]?goodsSpec[selectgoodsspec].stock:'' }}</text>
            </view>
            
          </view>
          <view class="commission_money flex_wrapper" v-if="orderList.commissionMoney>0&&orderList.stocks !== 0">
            佣金:￥{{ orderList.commissionMoney }}
          </view>
          <view class="cancellation_" @tap.stop="skuShowCloneFn">
            <image src="/static/user/close.png"></image>
          </view>
        </view>
        <view class="content_wrapper">
          <view class="sku_wrapper" >
            <view class="title_wrapper">产品规格</view>
            <view class="item_wrapper">
              <view
                  class="item_"
                  :class="selectgoodsspec==index ? 'active' : ''"
                  v-for="(item, index) in goodsSpec"
                  :key="index"
                  @tap="skuListFn(index,item)"
              >{{ item.name }}
              </view>
            </view>
          </view>
          <view class="pup-sku-count">
            <view class="num-wrap">
              <view class="minus" @tap="onCountMinus">
                <text class="row" :class="goodsSpec[selectgoodsspec]&&goodsSpec[selectgoodsspec].stock==0?'disableCss':''"></text>
              </view>
              <view class="text-wrap">
                <input type="number" :value="prodNum" disabled :class="goodsSpec[selectgoodsspec]&&goodsSpec[selectgoodsspec].stock==0?'disableCss':''"></input>
              </view>
              <view class="plus" @tap="onCountPlus">
                <text class="row left" :class="goodsSpec[selectgoodsspec]&&goodsSpec[selectgoodsspec].stock==0?'disableCss':''"></text>
                <text class="col" :class="goodsSpec[selectgoodsspec]&&goodsSpec[selectgoodsspec].stock==0?'disableCss':''"></text>
              </view>
            </view>
            <view class="count-name">购买数量</view>
          </view>
          <view class="pup-sku-footer">
                   <view class="btn cart" @tap="buyNow">加入购物车</view>
            <view class="btn buy"
                  :class="orderList.stocks===0?'Disable':''"
                  @tap="buyNowfun">
              {{
                orderList.stocks === 0 ? '暂无库存' : '立即下单'
              }}
            </view>
          </view>
        </view>

      </view>
    </u-popup>
    <u-toast ref="uToast"/>
    <!-- 规格弹窗 -->
    <!--            <view class="pup-sku" v-if="skuShow">-->
    <!--              <view class="pup-sku-main">-->
    <!--                <view class="pup-sku-header">-->
    <!--                  <image class="pup-sku-img" :src="orderList.pic?orderList.pic:detailObj.pic"></image>-->
    <!--                  <view class="pup-sku-price">-->
    <!--                    ￥-->
    <!--                    <text v-if="orderList && orderList.price" class="pup-sku-price-int">{{ orderList.price }}</text>-->
    <!--                    <text class="oriPriceCss" v-if="orderList.oriPrice">{{ orderList.oriPrice }}</text>-->
    <!--                  </view>-->
    <!--                  <view class="pup-sku-prop number_wrapper" v-if="orderList.stocks">剩余-->
    <!--                    <text>{{ orderList.stocks }}</text>-->
    <!--                  </view>-->
    <!--                  <view class="pup-sku-prop">-->
    <!--                    <text>已选</text>-->
    <!--                    {{ orderList.skuName ? orderList.skuName + ',' : '请选择' }}{{ prodNum }}件-->
    <!--                  </view>-->
    <!--                  <view class="close" @tap="closePopup"></view>-->
    <!--                </view>-->
    <!--                <view class="pup-sku-body">-->
    <!--                  <view class="pup-sku-area">-->
    <!--                    <block>-->
    <!--                      <view class="sku-kind">{{ '规格' }}</view>-->
    <!--                      <view class="shopItem_">-->
    <!--                        <block v-for="(item, index) in shopPingSelSkusList" :key="index">-->
    <!--                          <text :class="active===index?'active':''"-->
    <!--                                @tap="toChooseItem(item,index)" :data-val="item">-->
    <!--                            {{ item.skuName }}-->
    <!--                          </text>-->
    <!--                        </block>-->
    <!--                      </view>-->
    <!--                    </block>-->
    <!--                  </view>-->
    <!--                  <view class="pup-sku-count">-->
    <!--                    <view class="num-wrap">-->
    <!--                      <view class="minus" @tap="onCountMinus">-->
    <!--                        <text class="row"></text>-->
    <!--                      </view>-->
    <!--                      <view class="text-wrap">-->
    <!--                        <input type="number" :value="prodNum" disabled></input>-->
    <!--                      </view>-->
    <!--                      <view class="plus" @tap="onCountPlus">-->
    <!--                        <text class="row"></text>-->
    <!--                        <text class="col"></text>-->
    <!--                      </view>-->
    <!--                    </view>-->
    <!--                    <view class="count-name">购买数量</view>-->
    <!--                  </view>-->
    <!--                </view>-->
    <!--                <view class="pup-sku-footer">-->
    <!--                  &lt;!&ndash;        <view class="btn cart" @tap="addToCart">加入购物车</view>&ndash;&gt;-->
    <!--                  <view class="btn buy" @tap="buyNow">确定</view>-->
    <!--                </view>-->
    <!--              </view>-->
    <!--            </view>-->

    <!-- 商品服务 -->
    <!--    <Service v-if="!isLoading" :goods-id="prodId" />-->

    <!-- 商品SKU弹窗 -->
    <!--    <SkuPopup-->
    <!--      v-if="!isLoading"-->
    <!--      v-model="showSkuPopup"-->
    <!--      :skuMode="skuMode"-->
    <!--      :goods="shopPingSelSkusList"-->
    <!--      @addCart="onAddCart"-->
    <!--    />-->

    <!-- 商品评价 -->
    <!--    <Comment v-if="!isLoading" :goods-id="prodId" :limit="2" />-->

    <!--   商品详情介绍 -->
    <view class="introduce_wrapper" v-if="orderList.introduce">
      <view class="title_">—— 详情介绍 ——</view>
      <view class="image_wrapper">
		  <!-- <view class="" v-html="orderList.useText">
		  
		  	
		  </view> -->
        <mp-html :content="orderList.introduce"/>
        <!--        <image-->
        <!--            src="https://img.zcool.cn/community/01a43f5e814b52a8012165184cc3ed.jpg@1280w_1l_2o_100sh.jpg"-->
        <!--        ></image>-->
      </view>
    </view>

    <!-- 商品描述 -->
    <!--        <view v-if="!isLoading" class="goods-content m-top20">-->
    <!--          <view class="item-title b-f">-->
    <!--            <text>商品描述</text>-->
    <!--          </view>-->
    <!--          <block v-if="goods.content != ''">-->
    <!--            <view class="goods-content__detail b-f">-->
    <!--              <mp-html :content="goods.content" />-->
    <!--            </view>-->
    <!--          </block>-->
    <!--          <empty v-else tips="亲，暂无商品描述" />-->
    <!--        </view>-->

    <!-- 底部选项卡 -->
    <view class="footer-fixed">
      <view class="footer-container">
        <!-- 导航图标 -->
        <view class="foo-item-fast">
          <!-- 首页 -->
          <view class="fast-item fast-item--home" @click="onTargetHome">
            <view class="fast-icon">
              <image class="images_wrapper" src="/static/images/icon-shop.png"></image>
              <!--              <text class="iconfont icon-shouye"></text>-->
            </view>
            <view class="fast-text">
              <text>首页</text>
            </view>
			
          </view>
		  
		  <view class="fast-item fast-item--home" @click="gocar">
		    <view class="fast-icon"  >
		      <image class="images_wrapper" src="/static/images/11.png"></image>
		      <!--              <text class="iconfont icon-shouye"></text>-->
		    </view>
			
		    <view class="fast-text" >
		      <text>购物车</text>
		    </view>
		  			
		  </view>
		  <view class="fast-item fast-item--home" @click="goshare">
		    <view class="fast-icon"  >
		      <image class="images_wrapper" src="/static/images/icon-kf.png"></image>
		      <!--              <text class="iconfont icon-shouye"></text>-->
		    </view>
		  			
		    <view class="fast-text" >
		      <text>客服</text>
		    </view>
		  			
		  </view>
		 

          <!-- 收藏 -->
        <!--  <view class="fast-item fast-item--home foodcar" @click="collectHome">
          
            <view class="fast-text">
              <text>加入购物车</text>
            </view>
          </view> -->
          <!-- 客服 (仅微信小程序端显示) -->
          <!-- #ifdef MP-WEIXIN -->
          <!--          <button class="btn-normal" open-type="contact">-->
          <!--            <view class="fast-item">-->
          <!--              <view class="fast-icon">-->
          <!--                <text class="iconfont icon-kefu1"></text>-->
          <!--              </view>-->
          <!--              <view class="fast-text">-->
          <!--                <text>客服</text>-->
          <!--              </view>-->
          <!--            </view>-->
          <!--          </button>-->
          <!-- #endif -->
          <!-- 购物车 -->
          <!--          <view class="fast-item fast-item&#45;&#45;cart" @click="onTargetCart">-->
          <!--            <view v-if="cartTotal > 0" class="fast-badge fast-badge&#45;&#45;fixed"-->
          <!--              >{{ cartTotal > 99 ? "99+" : cartTotal }}-->
          <!--            </view>-->
          <!--            <view class="fast-icon">-->
          <!--              <text class="iconfont icon-gouwuche"></text>-->
          <!--            </view>-->
          <!--            <view class="fast-text">-->
          <!--              <text>购物车</text>-->
          <!--            </view>-->
          <!--          </view>-->
        </view>
        <!-- 操作按钮 -->
        <view class="foo-item-btn">
          <view class="btn-wrapper" >
                       <view class="btn-item btn-item-deputy" @tap="buyNow">
                         <text>加入购物车</text>
                       </view>
            <view class="btn-item btn-item-main"
                  @click="onShowSkuPopup(3)">
              <text>立即购买</text>
            </view>
          </view>
        </view>
      </view>
    </view>

    <!-- 快捷导航 -->
    <!-- <shortcut bottom="120rpx" /> -->
	<!-- <u-mask :show="showshareimg" @click="showshareimg = false">
		<view class="share-k">
			<image :src="shareimg" mode="widthFix"></image>
			
		</view>
	</u-mask> -->
  </view>
</template>

<script>
import SlideImage from "./components/SlideImage";
import {selProdImgs, selSkus} from "@/api/shopping";
import {getShareQrCode } from "@/api/share/share";
import {mapGetters} from "vuex";
import {BASE_URL_IMAHE} from "../../../../utils/https";
import {saveFootprint} from "@/api/myFootprint";
import {delUserCollectDelete, isUserCollect, saveUserCollectAdd} from "@/api/collect";
import {getGoodsDetails,saveGoodsCar,operateGoodsCollect} from "@/api/goodsdetail/index";


const app = getApp();
export default {
  components: {
    SlideImage,
  },
  data() {
    return {
      openId: '',
	  operate:0,
      list: [],
      parameterToggle: false,
      arr: [],
      loadCouponIds: false,
      commentShow: false,
      couponList: [],
      skuList: [],
      skuGroup: {},
      defaultSku: undefined,
      selectedProp: [],
      selectedPropObj: {},
      propKeys: [],
      allProperties: [],
      prodCommData: {},

      // 正在加载
      isLoading: true,
      // 当前商品ID
      prodId: null,
      // 商品详情
      goods: {
        goods_images: [],
      },
      // 购物车总数量
      cartTotal: 0,
      // 显示/隐藏SKU弹窗
      showSkuPopup: false,
      // 模式 1:都显示 2:只显示购物车 3:只显示立即购买
      skuMode: 1,
      skuShow: false,

      //详细数据
      detailObj: {},
      //数据规格
      shopPingSelSkusList: [],
      //数量
      prodNum: 1,
      orderList: {
        skuId: "",
        //单品数量
        quantity: 1,
        //商品类型 订单类型：1->普通订单；2->礼包订单；3->兑换订单;
        itemType: "1",
        //支付总金额 数量*现价
        payMoney: "",
        //订单总金额  数量*原价
        totalMoney: "",
        //订单总数量
        quantityTotal: "",
        //订单类型 订单类型：1->普通订单；2->礼包订单；3->兑换订单;
        orderType: '',
        //图片
        pic: "",
        //商品名称
        prodName: "",
        //选择的规格
        skuName: "",
        //单项价格
        price: "",
        //单项原价
        oriPrice: "",
        //剩余库存
        stocks: "",
      },
	  //商品规格
	  goodsSpec:[],
	  selectgoodsspec:0,
      active: 0,
      skuToggle: {},
      keys: [],
      httpUrl: BASE_URL_IMAHE,
      userInfoServer: {},
      collectToggle: false,
	  login:false
	  ,
	  shareimg:"",
	  showshareimg:false,
    };
  },

  onShow() {
    // this.userInfoServer = uni.getStorageSync("userInfoServer") ? uni.getStorageSync("userInfoServer") : ''
    // this.openId = uni.getStorageSync("openId") ? uni.getStorageSync("openId") : {}
    // this.saveFootprintFn()
    // //用户是否收藏
    // this.isUserCollectApi()
	if(uni.getStorageSync("userId")){
		this.login=true
	}else{
		this.login=false
	}
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    console.log(this.openId, "微信openid");
    console.log(options, "options");
	
	
	this.getGoodsDetailfun({goodsId:options.goodsId,userId:uni.getStorageSync("userId")?uni.getStorageSync("userId"):""})
	
	
	
    // if (options) {
    //   this.detailObj = options;
    //   this.detailObj.content = JSON.parse(decodeURIComponent(options.content))
    //   console.log(options.parentInviteCode, '这是商品页面 通过别人分享的openid')
    //   if (options && options.parentInviteCode) {
    //     uni.setStorageSync("parentInviteCode", options.parentInviteCode);
    //     app.globalData.data.parentInviteCode = options.parentInviteCode;
    //   } else if (options.query && options.query.scene) {
    //     uni.setStorageSync("parentInviteCode", options.query.scene);
    //     this.globalData.data.parentInviteCode = options.query.scene;
    //   }

    //   const {prodId} = options;
    //   // 记录商品ID
    //   this.prodId = parseInt(prodId);
    //   this.onRefreshPage();

    // }
    // 加载页面数据
    // this.onRefreshPage()
  },	

  methods: {
	  async operateGoodsCollectfun(){
		  if(!uni.getStorageSync("userId")){
			  uni.showToast({
			  	title:"您未授权，请先授权",
				icon:"none"
			  })
			  return
		  }
		   const res = await operateGoodsCollect({goodsId:this.orderList.id,userId:uni.getStorageSync("userId"), operate:this.operate==1?0:1});
		   if(res.result==0){
			   this.operate=this.operate==1?0:1
		   }
	  },
	  async goshare(){
		 if (!uni.getStorageSync("userId")) {
		  this.gologin()
		  return
		  }
		  
		   const res = await getShareQrCode({userId:uni.getStorageSync("userId"),v:uni.getStorageSync("v"), goodsId:this.orderList.id});
		   console.log(res)
		   if(res.result==0){
			   this.shareimg=this.httpUrlFun(res.qrCode) 
			   this.showshareimg=true
		   }else{
			   uni.showToast({
			     icon: "none",
			     title: "分享二维吗失败，请重试！",
			     duration: 2000,
			   });
		   }
		   
	  },
	  gocar(){
		  console.log('22323')
		  uni.navigateTo({
		    url: `/pages/subpackage/collect/index`,
		  });
	  },
	  gologin(){
	  	if (!uni.getStorageSync("userId")) {
	  	  // 弹窗告诉用户去登录
	  	  uni.showModal({
	  	    title: "温馨提示",
	  	    content: "此时此刻需要您登录喔~",
	  	    // showCancel: false,
	  	    confirmText: "去登录",
	  	    cancelText: "再逛会",
	  	    success: (res) => {
	  	      if (res.confirm) {
	  	        uni.navigateTo({
	  	          url: "/pages/empower/mp-weixin",
	  	        });
	  	      }
	  	      
	  	      
	  	    },
	  	  });
	  			return
	  	}
	  },
	  //获取商品详情
	async getGoodsDetailfun(date){
		var that=this
		let ordergoods= await getGoodsDetails(JSON.stringify(date))
		if(ordergoods.result==0){
			console.log(ordergoods)
			
			this.orderList=ordergoods.goods
			this.operate=ordergoods.collectFlag
			let imglist=ordergoods.goods.bannerImage.split("|");
			let imglistarr=[]
			imglist.forEach((element)=>{
				imglistarr.push(ordergoods.goods.dataSource==1?element: that.httpUrlFun(element))
				console.log("that.httpUrlFun(element)" ,that.httpUrlFun(element),imglistarr)
			})
			this.goods.goods_images=imglistarr
			this.goodsSpec=ordergoods.goodsSpec
			this.isLoading=false
			console.log("that.httpUrlFun(element)" ,this.goods.goods_images)

		}
	},
	httpUrlFun(item) {
	  return  BASE_URL_IMAHE + item;
	},
	
    //用户是否收藏
    async isUserCollectApi() {
      const params = {
        userId: this.userInfoServer.userId,
        prodId: this.detailObj.prodId
      }
      //添加用户收藏
      const res = await isUserCollect(params)
      console.log(res, '用户是否收藏')
      if (res.code === 0) {
        this.collectToggle = res.data
      } else {
        uni.showToast({
          icon: "none",
          title: "收藏更新失败!",
          duration: 2000,
        });
      }
    },

    //添加足迹
    async saveFootprintFn() {
      const data = {
        userId: this.userInfoServer.userId || "",
        prodId: this.detailObj.prodId || ""
      }
      //记录足迹
      await saveFootprint(data)
    },

    httpUrlFn() {
      return this.httpUrl + this.orderList.pic
    },


    //规格选择
    skuListFn(index, b) {
      //改为初始值1
      this.prodNum = 1
      this.orderList.quantity = this.prodNum;
	  this.selectgoodsspec=index
    },

    //参数弹出层
    parameterFn() {
      this.parameterToggle = true;
    },
    //弹出层收起
    closeFn() {
      // this.parameterToggle=false
      this.skuShow=false
    },
    openFn() {
      // console.log("open");
      // this.skuShow=false
    },
	/**
	 * 立即 购买
	 */
	buyNowfun(){
		if (!uni.getStorageSync("userId")) {
				  this.skuShow = false;
		  // 弹窗告诉用户去登录
		  uni.showModal({
		    title: "温馨提示",
		    content: "此时此刻需要您登录喔~",
		    // showCancel: false,
		    confirmText: "去登录",
		    cancelText: "再逛会",
		    success: (res) => {
		      if (res.confirm) {
		        uni.navigateTo({
		          url: "/pages/empower/mp-weixin",
		        });
		      }
		      
		      
		    },
		  });
				return
		}
		const params = {
		  userId: uni.getStorageSync("userId")?uni.getStorageSync("userId"):'',
				goodsId:this.orderList.id,
				goodsSpecId:this.goodsSpec[this.selectgoodsspec].id,
				// goodsSpecId:"1245651414",
				goodsNum:this.prodNum,
		}
		uni.navigateTo({
		  url: `/pages/subpackage/confirm/index?type=1&orderinfon=${JSON.stringify(params)}`,
		});
		
	},

    /**
     * 加入购物车
     */
    buyNow: function () {
      
	  
	  if (!uni.getStorageSync("userId")) {
		  this.skuShow = false;
	    // 弹窗告诉用户去登录
	    uni.showModal({
	      title: "温馨提示",
	      content: "此时此刻需要您登录喔~",
	      // showCancel: false,
	      confirmText: "去登录",
	      cancelText: "再逛会",
	      success: (res) => {
	        if (res.confirm) {
	          uni.navigateTo({
	            url: "/pages/empower/mp-weixin",
	          });
	        }
	        
	        
	      },
	    });
	  		return
	  }
	  if (this.orderList.stock == 0) {
	    this.$refs.uToast.show({
	      title: '商品加急备货中，先看看其他商品吧!',
	      type: 'info',
	    })
	    return;
	  }
	 

this.collectHome()

     
    },

    /**
     * 减数量
     */
    onCountMinus: function () {
      var prodNum = this.prodNum;

      if (prodNum > 1) {
        this.setData({
          prodNum: prodNum - 1,
        });
        // this.orderList.quantity = this.prodNum;
      }
    },

    /**
     * 加数量
     */
    onCountPlus: function () {
      if (this.goodsSpec[this.selectgoodsspec].stock === 0) {
        this.$refs.uToast.show({
          title: '商品加急备货中，先看看其他商品吧!',
          type: 'info',
        })
        return;
      }
      var prodNum = this.prodNum;

      if (prodNum < 1000&&this.goodsSpec[this.selectgoodsspec].stock>prodNum) {
        this.setData({
          prodNum: prodNum + 1,
        });
        // this.orderList.quantity = this.prodNum;
      }
    },

    closePopup() {
      this.setData({
        skuShow: false,
      });
    },
    //点击选择规格
    toChooseItem(item, index) {
      this.active = index;
      uni.showLoading({
        title: "加载中...",
      });
      setTimeout(() => {
        uni.hideLoading();
      }, 100);
      this.orderList = {
        skuId: item.skuId,
        //单品数量
        quantity: this.prodNum,
        //商品类型 订单类型：1->普通订单；2->礼包订单；3->兑换订单;
        itemType: this.detailObj.itemType,
        //支付总金额 数量*现价
        payMoney: (this.prodNum * item.price * 100) / 100,
        //订单总金额  数量*原价
        totalMoney: (this.prodNum * item.oriPrice * 100) / 100,
        //订单总数量
        quantityTotal: this.prodNum,
        //订单类型 订单类型：1->普通订单；2->礼包订单；3->兑换订单;
        orderType: this.detailObj.channelId,
        //图片
        pic: item.pic,
        //商品名称
        prodName: item.prodName,
        //选择的规格
        skuName: item.skuName,
        //单项价格
        price: item.price,
        //单项原价
        oriPrice: item.oriPrice,
        //库存
        stocks: item.stocks,
      };
    },
    //判断数组是否包含某对象
    array_contain: function (array, obj) {
      for (var i = 0; i < array.length; i++) {
        if (array[i] == obj)
            //如果要求数据类型也一致，这里可使用恒等号===
          return true;
      }

      return false;
    },

    //根据sku的属性 分组
    groupSkuProp() {
      console.log("分组");
      var skuList = this.shopPingSelSkusList;

      // this.setData({
      //   skuGroup: skuGroup,
      //   allProperties: allProperties
      // });
    },

    //打款规格弹窗
    showSku() {
      this.setData({
        skuShow: true,
      });
    },
    //关闭规格弹窗
    skuShowCloneFn() {
      this.setData({
        skuShow: false,
      });
    },


    // 刷新页面数据
    onRefreshPage() {
      const app = this;
      app.isLoading = true;
      Promise.all([app.shopPingSelSkus(), app.shopPingImg()]).finally(
          () => (app.isLoading = false)
      );
    },

    //商品图片列表
    async shopPingImg() {
      const res = await selProdImgs(this.prodId);
      res.data.forEach(item => {
        item.goodsDetailsImg = BASE_URL_IMAHE + item.goodsDetailsImg
      })
      if (res.code === 0) {
        this.goods.goods_images = [
          {goodsDetailsImg: BASE_URL_IMAHE + this.detailObj.pic, prodId: this.prodId},
          ...res.data,
        ];
      }
    },

    //商品规格获取
    async shopPingSelSkus() {
		return
      const res = await selSkus(this.prodId);
      const than = this;
      if (res.code === 0) {
        //保存全部的规格数据
        this.shopPingSelSkusList = JSON.parse(JSON.stringify(res.data));
        const keys = [];
        this.shopPingSelSkusList.forEach((item) => {
          const index = keys.findIndex((val) => {
            return val !== Object.keys(item.propertiesObject);
          });
          if (index === -1) {
            keys.push(...Object.keys(item.propertiesObject));
            this.keys.push(...Object.keys(item.propertiesObject));
          }
        });
        //
        keys.forEach((f, i) => {
          const obj = {
            name: "",
            arr: [],
          };
          this.shopPingSelSkusList.forEach((item, index) => {
            if (Object.keys(item.propertiesObject)[i] === keys[i]) {
              obj.name = f;

              const index = obj.arr.findIndex(
                  (t) => t === item.propertiesObject[keys[i]]
              );
              if (index === -1) {
                obj.arr.push(item.propertiesObject[keys[i]]);
              }
            }
          });
          this.list.push(obj);
        });
        //页面加载给数据遍历添加selectIndex 属性
        this.list.forEach((element) => {
          element.selectIndex = 0;
          element.value = element.arr[0];
        });


        const aaalist = this.shopPingSelSkusList.filter(item => {
          return this.list.every((f, i) => {
            return Object.values(item.propertiesObject).includes(f.value)
          })
        })
        // if (aaalist.length === 0) {
        //   this.orderList.stocks = 0
        //   this.orderList.price = 999
        //   this.orderList.oriPrice = 999
        //   this.orderList.prodName = '暂无库存'
        //   this.orderList.inventory = '暂无库存'
        // } else {
        //   this.orderList = JSON.parse(JSON.stringify(aaalist[0]))
        //   const {uniteCommission, partnerCommission, facilitatorCommission, shopkeeperCommission} = this.orderList
        //   this.orderList.commissionMoney = this.userInfoServer.roleId === 1 ? uniteCommission :
        //       this.userInfoServer.roleId === 2 ? partnerCommission :
        //           this.userInfoServer.roleId === 3 ? facilitatorCommission :
        //               this.userInfoServer.roleId === 4 ? shopkeeperCommission : 0

        // }

        let selected = JSON.parse(JSON.stringify(this.list))
        console.log(selected, 'selected')
        selected = selected.map(item => {
          return item.value
        }).join(',')
        //选择的规格
        this.orderList.selected = selected
        if (aaalist[0].stocks === 0) {
          this.orderList.inventory = '暂无库存'
        }
      }
    },

    // 获取商品信息
    getGoodsDetail() {
      const app = this;
      return new Promise((resolve, reject) => {
        // GoodsApi.detail(app.prodId)
        //     .then(result => {
        //       app.goods = result.data.detail
        //       resolve(result)
        //     })
        //     .catch(reject)
      });
    },

    // 获取购物车总数量
    getCartTotal() {
      const app = this;
      return new Promise((resolve, reject) => {
        // CartApi.total()
        //     .then(result => {
        //       app.cartTotal = result.data.cartTotal
        //       resolve(result)
        //     })
        //     .catch(reject)
      });
    },

    // 更新购物车数量
    onAddCart(total) {
      this.cartTotal = total;
    },

    /**
     * 显示/隐藏SKU弹窗
     * @param {skuMode} 模式 1:都显示 2:只显示购物车 3:只显示立即购买
     */
    onShowSkuPopup(skuMode = 1) {
      // this.skuMode = skuMode;
      // console.log(this.skuMode, "skuMode");
      // this.showSkuPopup = !this.showSkuPopup;
      this.setData({
        skuShow: true,
      });
    },

    // 跳转到首页
    onTargetHome(e) {
      uni.switchTab({
        url: "/pages/index/index",
      });
    },

    //收藏
    async collectHome() {
		console.log('点击了收藏',this.prodNum,this.goodsSpec[this.selectgoodsspec].id)
		// return
      
      console.log(this.detailObj, 'detailObj')
      console.log(this.userInfoServer, 'userInfoServer')
      const params = {
        userId: uni.getStorageSync("userId")?uni.getStorageSync("userId"):'',
		goodsId:this.orderList.id,
		goodsSpecId:this.goodsSpec[this.selectgoodsspec].id,
		// goodsSpecId:"1245651414",
		goodsNum:this.prodNum,
      }
      // let res
      // if (this.collectToggle) {
      //   //删除用户收藏
      //   res = await saveGoodsCar(params)
      //   console.log(res, '删除用户收藏')
      // } else {
      //   //添加用户收藏
      //   res = await saveUserCollectAdd(params)
      //   console.log(res, '添加用户收藏')
      // }
      // //用户是否收藏
      // await this.isUserCollectApi()
	  console.log(params)
	  
	  // return
	  var res = await saveGoodsCar(JSON.stringify(params))
	  // console.log(res,)
	  // let that=this
	  if(res.result==0){
		  uni.showToast({
		    title: "已添加到购物车",
		    icon: "success",
		  });
		  // setTimeout(()=>{
			 //  uni.navigateTo({
			 //    url: `/pages/subpackage/collect/index`,
			 //  });
		  // },2000)
		 
	  }else{
		  
		  uni.showToast({
		    title: res.message,
		    icon: "none",
		  });
	  }
    },


    // 跳转到购物车页
    onTargetCart() {
      // this.$navTo("pages/cart/index");
    },
  },
  
  /**
   * 分享当前页面
   */
  onShareAppMessage() {
    console.log("分享");
    const phoneNumber = uni.getStorageSync("phoneNumber") || ""
    return {
      title: this.detailObj.prodName,
      path: `/pages/subpackage/goods/detail?prodId=${this.detailObj.prodId}&pic=${this.detailObj.pic}&vrPayUsers=${this.detailObj.vrPayUsers}&properties=${this.detailObj.properties}&content=${encodeURIComponent(JSON.stringify(this.detailObj.content))}&channelId=${this.detailObj.channelId}&itemType=${this.detailObj.itemType}&parentInviteCode=${phoneNumber}`,
    };
  },

  /**
   * 分享到朋友圈
   * 本接口为 Beta 版本，暂只在 Android 平台支持，详见分享到朋友圈 (Beta)
   * https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/share-timeline.html
   */
  // onShareTimeline() {
  //   const app = this;
  //   // 构建页面参数
  //   const params = app.$getShareUrlParams({
  //     prodId: app.prodId,
  //   });
  //   return {
  //     title: app.goods.goods_name,
  //     path: `/pages/goods/detail?${params}`,
  //   };
  // },
};
</script>

<style>
page {
  background: #fafafa;
}
</style>
<style lang="scss" scoped>
@import "./detail.scss";
@import "./prod.css";

.info-item__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.info-item__name {
  display: flex;

  > .goods-name {
    flex: 1;
    display: flex;
    align-items: center;

    > view.twoline-hide {
      flex: 1;
      overflow: hidden;
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2; /*最大行数*/
    }
  }

  > .goods-share__line {
    margin-left: auto;
  }

  > .goods-share {
    > button {
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: center;

      .share__icon {
        margin-right: rpx(5);
        vertical-align: middle;
      }
    }
  }
}

.footer-container {
  display: flex;
  justify-content: space-between;
}

.foo-item-fast {
  width: 100% !important;
  display: flex;
  justify-content: start;
  align-items: center;
}

.foo-item-btn {
  flex: none;
}
.btn-item-deputy{
	background: #fa5151;
	border-radius: rpx(20);
	font-size: rpx(17);
	font-weight: 400;
	color: #ffffff;
	padding: rpx(9) rpx(10) rpx(9);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: nowrap;
	text{
		white-space: nowrap;
	}
}

.btn-item-main {
  background: #fa5151;
  border-radius: rpx(20);
  font-size: rpx(17);
  font-weight: 400;
  color: #ffffff;
  padding: rpx(9) rpx(20) rpx(9);
  display: flex;
  align-items: center;
  justify-content: center;
}

.introduce_wrapper {
  width: 100%;
  margin-bottom: rpx(10);

  > .title_ {
    width: rpx(375);
    height: rpx(41);
    background: #ffffff;
    font-size: rpx(15);
    font-weight: 400;
    color: #b2b2b2;
    display: flex;
    justify-content: center;
    align-items: center;
  }

  > .image_wrapper {
    width: 100%;
	box-sizing: border-box;
	padding: 0 rpx(10);
	padding-top: rpx(10);
	background-color: white;

    > image {
      vertical-align: middle;
      width: rpx(375);
      height: rpx(794);
    }
  }
}

.goods-choice {
  background: #ffffff;
  margin: rpx(8) rpx(0);
}
.goods-det{
	display: flex;
	flex-direction: column;
	// margin: rpx(8) rpx(0);
	margin: 0rpx 20rpx 20rpx;
	border-bottom-left-radius: 25rpx;
	border-bottom-right-radius: 25rpx;
	background-color: #fff;
	box-sizing: border-box;
	padding:rpx(0) rpx(10) rpx(10);
	font-size: rpx(14);
	line-height: rpx(26);
	.goods-det-cx{
		display: flex;
		justify-content: left;
		align-items: center;
		.goods-det-cx-item{
			border-radius: 5rpx;
			border: 1rpx solid #cf877f;
			display: flex;
			align-items: center;
			margin-right: 22rpx;
			.goods-det-cx-item-title{
				width: 48rpx;
				height: 24rpx;
				background-color: #af372a;
				font-size: 16rpx;
				font-weight: bold;
				color: #ffffff;
				line-height: 24rpx;
				text-align: center;
				border-radius: 5rpx;
			}
			.goods-det-cx-item-content{
				width: 100%;
				height: 24rpx;
				font-size: 16rpx;
				color: #af372a;
				line-height: 24rpx;
				text-align: center;
			}
		}
	}
	>.goods-dt{
		padding-top: 18rpx;
		padding-bottom: 20rpx;
		display: flex;
		justify-content: left;
		>.goods-left{
			// margin-left: rpx(15);
			color: #b2b2b2;
		}
		>.goods-right{
			flex: 1;
			// margin-left: rpx(10);
			line-height: rpx(20);
			font-size: 36rpx;
			font-weight: bold;
			line-height: 50rpx;
			// overflow: hidden;
			// text-overflow: ellipsis;
			// white-space: nowrap;
		}
	}
	.goods-det-two{
		display: flex;
		justify-content: space-between;
		>.goods-dt{
			flex: 1;
			display: flex;
			justify-content: left;
			>.goods-left{
				// margin-left: rpx(15);
				color: #b2b2b2;
			}
			>.goods-right{
				flex: 1;
				margin-left: rpx(10);
				margin-right: rpx(10);
				// overflow: hidden;
				// text-overflow: ellipsis;
				// white-space: nowrap;
			}
		}
	}
	
}


.sku {
  display: flex;
  flex-direction: column;
  margin: rpx(8) rpx(0);

  > view {
    display: flex;
    position: relative;
    align-items: center;

    > view {
      position: static;
      padding: 0rpx;
    }
	
.sku-cx{
	width: 50rpx;
	height: 24rpx;
	background-color: #af372a;
	font-size: 16rpx;
	font-weight: bold;
	color: #ffffff;
	line-height: 24rpx;
	text-align: center;
	border-radius: 5rpx;
	padding: 0rpx;
}
    .sku-tit {
      margin-right: rpx(15);
      font-size: rpx(14);
      font-weight: 400;
      color: #b2b2b2;
	  white-space: nowrap;
    }

    .sku-con {
      margin: 20rpx;
      flex: 1;
      font-size: rpx(14);
      font-weight: 400;
      color: #353535;
    }

    .more {
      margin-left: auto;
	  > image{
		  width: rpx(16);
	  }
    }
  }
  .sku-bq{
	  background-color: #eeeeee;
	  border-radius: 50rpx;
	  width: 100%;
	  height: 45rpx;
	  padding: 0rpx;
	  .sku-bq-item{
		  margin-left: 15rpx;
		  margin-right: 15rpx;
		  padding: 0rpx;
		  display: flex;
		  align-items: center;
		  > image{
		  		  width: 31rpx;
		  }
	  }
	  
  }
}

.oriPriceCss {
  font-size: rpx(12);
  font-weight: 400;
  color: #b2b2b2;
  text-decoration: line-through;
  margin-left: rpx(8);
}

.number_wrapper {
  font-size: rpx(12);
  font-weight: 400;
  color: #888888;
  margin-top: rpx(-10);
  margin-bottom: rpx(5);

  > text {
    color: #fa5151;
  }
}

.pup-sku-footer {
  background: #ffffff;
  padding: rpx(16);
  display: flex;
  width: 100%;
  justify-content: space-between;
  > .btn {
    width: 300rpx;
    background: linear-gradient(to right, #ff5951, #fe3b30);
	
    padding: rpx(10) rpx(0);
    border-radius: rpx(22);
    height: rpx(44);
  }
}

.shopItem_ {
  box-sizing: border-box;
  display: flex;
  margin-bottom: rpx(24);
  padding-left: rpx(16);
  flex-wrap: wrap;
  //.sku-choose-item {
  //  background: #F5F5F5;
  //  border-radius: rpx(5);
  //  color: #888888;
  //  font-size: rpx(13);
  //  font-weight: 400;
  //  padding: rpx(6) rpx(11);
  //}
  text {
    background: #f5f5f5;
    border-radius: rpx(5);
    padding: rpx(6) rpx(23);
    font-size: rpx(13);
    font-weight: 400;
    color: #888888;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: rpx(16);
    margin-bottom: rpx(10);
  }

  .active {
    background: rgba(250, 81, 81, 0.1);
    border-radius: rpx(5);
    border: rpx(1) solid #fa5151;
    padding: rpx(5) rpx(22);
    font-size: rpx(13);
    font-weight: 400;
    color: #fa5151;
  }
}

.skuShow_wrapper {
  padding:rpx(30) rpx(16) rpx(16);

  > .header_ {
    display: flex;
    padding-bottom: rpx(16);
    border-bottom: rpx(1) solid #efefef;
    position: relative;

    > image {
      width: rpx(72);
      height: rpx(72);
      vertical-align: middle;
      //background: pink;
      margin-right: rpx(30);
      //border: 1px solid #cccccc;
    }

    > .money_wrapper {
      display: flex;
      flex: 1;
      flex-direction: column;
      justify-content: space-between;

      > .item_1 {
        display: flex;
        align-items: center;

        > .left_ {
          font-size: rpx(12);
          font-weight: bold;
          color: #fa5151;
          margin-right: rpx(8);

          > text {
            font-size: rpx(20);
          }
		  .back_s{
			  font-size: rpx(12);
			  color: #888888;
			  font-weight: normal;
		  }
        }

        > .right_ {
          font-size: rpx(12);
          font-weight: 400;
          color: #b2b2b2;
          text-decoration: line-through;
        }
      }

      > .item_2 {
        margin-top: rpx(2);
        color: #888888;
        font-size: rpx(12);
        font-weight: 400;

        > text {
          color: #fa5151;
          margin-left: rpx(2);
        }
      }

      > .item_3 {
        //background: pink;
        //padding-right: rpx(40);
        > view {
          font-size: 24rpx;
		  
          font-weight: bold;
          color: #353535;
		  line-height: 40rpx;
        }
      }
    }

    > .cancellation_ {
      margin-left: auto;
	  

      > image {
        width: rpx(20);
        height: rpx(20);
        vertical-align: middle;
        margin-top: rpx(-20);
      }
    }
  }

  .count-name {
    font-size: rpx(15);
    font-weight: bold;
    color: #353535;
  }

  > .content_wrapper {
    padding: rpx(24) rpx(0) rpx(0);

    > .sku_wrapper {
      > .title_wrapper {
        font-size: rpx(15);
        font-weight: bold;
        color: #353535;
        margin-bottom: rpx(8);
      }

      > .item_wrapper {
        display: flex;
        flex-wrap: wrap;

        > .item_ {
          background: #f5f5f5;
          border-radius: 50rpx;
          padding: rpx(6) rpx(11);
          margin-right: rpx(16);
          margin-bottom: rpx(16);
          font-size: rpx(13);
          font-weight: 400;
          color: #888888;

          &.active {
            // background: rgba(250, 81, 81, 0.1);
			background: linear-gradient(to right, #ffe8ce, #fbb9a1);
            border-radius: 50rpx;
            padding: rpx(5) rpx(10);
            border: rpx(1) solid #fa5151;
            font-size: rpx(13);
            font-weight: 400;
            color: #d90000;
          }
        }
      }
    }
  }
}


view.Disable {
  cursor: not-allowed;
  background-color: #ccc !important;
  color: #fff !important;
}

.num-wrap .row.disableCss {
  background: #B2B2B2 !important;
}

.num-wrap .row.disableCss {
  background: #B2B2B2 !important;
}

.num-wrap .col.disableCss {
  background: #B2B2B2 !important;
}

.num-wrap .text-wrap .disableCss {
  color: #B2B2B2 !important;
}

.commission_money {
  padding: rpx(1) rpx(3);
  background: rgba(250, 81, 81, 0.1);
  border-radius: rpx(2);
  border: rpx(1) solid #FA5151;
  font-size: rpx(11);
  font-weight: 400;
  color: #FA5151;
  margin-right: rpx(5);
  margin-left: rpx(5);
}

.flex_wrapper {
  position: absolute;
  right: 0;
  bottom: rpx(16);
}

.images_wrapper {
  width: rpx(24);
  height: rpx(24);
  vertical-align: middle;
}

.fast-text {
  font-size: rpx(10);
  font-weight: 400;
  color: #B2B2B2;
  text{
	  white-space: nowrap;
  }
}
.share-k{
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}
.share-k image{
	width: 60%;
}

</style>
